<template>
  <div class="banner-wrapper">
              <section class="banner-two banner-carousel__one no-dots owl-theme owl-carousel">
                  <div class="banner-two__slide banner-two__slide-one" :style="{backgroundImage: `url(/assets/images/slider-2-1.jpg)`}">
                      <div class="container">
                          <div class="row no-gutters">
                              <div class="col-xl-12">
                                  <p class="banner-two__tag-line">High quality courses</p><!-- /.banner-two__tag-line -->
                                  <h3 class="banner-two__title banner-two__light-color">Read & learn <br>
                                      in an easy way</h3><!-- /.banner-two__title -->
                                  <a href="#" class="thm-btn banner-two__btn">Learn More</a>
                              </div><!-- /.col-xl-12 -->
                          </div><!-- /.row -->
                      </div><!-- /.container -->
                  </div><!-- /.banner-two__slide -->
                  <div class="banner-two__slide banner-two__slide-two" :style="{backgroundImage: `url(/assets/images/slider-2-2.jpg)`}">
                      <div class="container">
                          <div class="row no-gutters">
                              <div class="col-xl-12">
                                  <p class="banner-two__tag-line">High quality courses</p><!-- /.banner-two__tag-line -->
                                  <h3 class="banner-two__title banner-two__light-color">Read & learn <br>
                                      in an easy way</h3><!-- /.banner-two__title -->
                                  <a href="#" class="thm-btn banner-two__btn">Learn More</a>
                              </div><!-- /.col-xl-12 -->
                          </div><!-- /.row -->
                      </div><!-- /.container -->
                  </div><!-- /.banner-two__slide -->
              </section><!-- /.banner-two -->
              <div class="banner-carousel-btn">
                  <a href="#" class="banner-carousel-btn__left-btn"><i class="kipso-icon-left-arrow"></i></a>
                  <a href="#" class="banner-carousel-btn__right-btn"><i class="kipso-icon-right-arrow"></i></a>
              </div><!-- /.banner-carousel-btn -->
          </div>
</template>

<script>
    export default {
        name: "BannerTwo"
    }
</script>

<style scoped>

</style>
